<div>
	<div class="row">
		<div class="col-md-4 instance-name">{{instance.name}}</div>
		<div class="col-md-1 text-muted small">{{instance.path}}</div>
		<div class="col-md-1 text-muted small"><span ng-if="instance.observed" class="glyphicon glyphicon-eye-open"></span></div>
		<div class="col-md-6">
			<div class="btn-toolbar" role="toolbar">
				<div class="btn-group">
					<button type="button" ng-click="instance.observe.status = null; startObserve()"
							tooltip-html-unsafe={{instance.observe.tooltip}} tooltip-placement="right" tooltip-animation="false" tooltip-append-to-body="true"
							ng-class="{
								'btn': true,
								'btn-xs': true,
								'btn-default': instance.observe.status == null,
								'btn-info': instance.observe.status == 'TIMEOUT',
								'btn-danger': instance.observe.status == 'ERROR',
								'btn-warning': instance.observe.status == 'INVALID',
								'btn-success': instance.observe.status == 'SUCCESS'}">Observe <span class="glyphicon glyphicon-play"></span></button>
					<button type="button" ng-click="stopObserve()"
							ng-class="{
								'btn': true,
								'btn-xs': true,
								'btn-default': instance.observe.stop == null,
								'btn-success': instance.observe.stop == 'success' }"><span class="glyphicon glyphicon-stop"></span></button>
				</div>
				<div class="btn-group">
					<button type="button" ng-click="instance.read.status = null; read()"
							tooltip-html-unsafe={{instance.read.tooltip}} tooltip-placement="right" tooltip-animation="false" tooltip-append-to-body="true"
							ng-class="{
								'btn': true,
								'btn-xs': true,
								'btn-default': instance.read.status == null,
								'btn-info': instance.read.status == 'TIMEOUT',
								'btn-danger': instance.read.status == 'ERROR',
								'btn-warning': instance.read.status == 'INVALID',
								'btn-success': instance.read.status == 'SUCCESS'}">Read</button>
				</div>
				<div class="btn-group">
					<button type="button" ng-click="instance.write.status = null; write()" ng_show="writable()"}
							tooltip-html-unsafe={{instance.write.tooltip}} tooltip-placement="right" tooltip-animation="false" tooltip-append-to-body="true"
							ng-class="{
								'btn': true,
								'btn-xs': true,
								'btn-default': instance.write.status == null,
								'btn-info': instance.write.status == 'TIMEOUT',
								'btn-danger': instance.write.status == 'ERROR',
								'btn-warning': instance.write.status == 'INVALID',
								'btn-success': instance.write.status == 'SUCCESS'}">Write</button>
				</div>
				<div class="btn-group">
					<button type="button" ng-click="instance.del.status = null; del()"
							tooltip-html-unsafe={{instance.del.tooltip}} tooltip-placement="right" tooltip-animation="false" tooltip-append-to-body="true"
							ng-class="{
								'btn': true,
								'btn-xs': true,
								'btn-default': instance.del.status == null,
								'btn-info': instance.del.status == 'TIMEOUT',
								'btn-danger': instance.del.status == 'ERROR',
								'btn-warning': instance.del.status == 'INVALID',
								'btn-success': instance.del.status == 'SUCCESS'}">Delete</button>
				</div>
			</div>
		</div>
	</div>
	<resource ng-repeat='resource in instance.resources' resource='resource' parent='instance' settings='settings'></resource>
</div>
